// tab栏切换
$('.hide').hide()
var iid = 1
$('.tab').each((index, item) => {
    item.addEventListener('click', () => {
        iid = index
        console.log(index);

        fuxian()
    })
})
function fuxian() {
    $('.hide').each((index1) => {
        // $(".hide").hide()
$(".xiang").hide()
        $(".sss").show()
        $('.xiugai').hide()
        if (index1 == iid) {
            $(".hide").hide()
            $(".hide").eq(index1).show()
        }

    })

}
fuxian()
//退出登录
$('.tui').click(() => {
    location.assign("../登录.html/登录.html")
})
//渲染
var boy = $('.boy2')
function fu(cc) {
    boy.html('')
    cc.forEach(item => {
        if (item.sex == 1) {
            item.sex = '女'
        }
        else if (item.sex == 0) {
            item.sex = '男'
        }
        // console.log(item);
        boy.append(`
        <tr>
                    <td>${item.id}</td>
                    <td>${item.name}</td>
                    <td>${item.nick}</td>
                    <td>${item.birthdata}</td>
                    <td>${item.sex}</td>
                    <td>${item.iphone}</td>
                    <td> 
                        <button class="color1" onclick="xiang(${item.id})">查看</button>
                        <button class="color1" onclick="xiu(${item.id})" class="tab">编辑</button>
                        <button class="color2" onclick="zhu(${item.id})">注销</button></td>
                </tr> `)
    });
}
//渲染
function xuan() {
    $.ajax({
        type: 'get',
        url: 'http://47.94.4.201/index.php/index/teacher/teacherlist',
        data: {
            page: 1,
            pagelimit: 20
        },
        dataType: 'json',
        success: (arr) => {
            var a = arr.data.data
            fu(a)
            $(".boy2 tr").even().css('background-color','rgb(249, 249, 249)')
            $(".boy2 tr").odd().css('background-color','white')
            
        },
        error: (e) => {
            console.log(e);
        }
    })
}
xuan()
//搜索
$('.sou').on('click', () => {
    console.log(5);
    var name = $('.suo').val()
    $.ajax({
        type: 'get',
        url: 'http://47.94.4.201/index.php/index/teacher/getsearch',
        data: {
            name: name
        },
        dataType: 'json',
        success: (arr) => {
            var a = arr.data.data
            console.log(a);
            fu(a)


        },
        error: (e) => {
            console.log(e);
        }
    })
})
//注销
function zhu(id) {
    $.ajax({
        type: 'get',
        url: 'http://47.94.4.201/index.php/index/teacher/delteacher',
        data: {
            id: id
        },
        dataType: 'json',
        success: (arr) => {
            // var a = 
            console.log(arr);
            xuan()


        },
        error: (e) => {
            console.log(e);
        }
    })
}
//添加
// $('.tj').hide()
// $(".tj1").click(()=>{
// $('.tj').show()
// })
function tian() {
    var inp = $(".inps")
    console.log(inp.eq(1).val());
    console.log(inp.eq(2).val());
    console.log(inp.eq(3).val());
    console.log(inp.eq(4).val());
    console.log(inp.eq(5).val());
    iid = 1
    $.ajax({
        type: 'post',
        url: 'http://47.94.4.201/index.php/index/index/addteacher',
        data: {
            name: inp.eq(1).val(),
            nick: inp.eq(2).val(),
            sex: inp.eq(3).val(),
            birthdata: inp.eq(4).val(),
            iphone: inp.eq(5).val(),
        },
        dataType: 'json',
        success: (arr) => {
            var a=arr.msg
            if(a=="参数不能为空"){
               alert('参数不能为空')
            }else if(a=='添加成功'){
                xuan()
                fuxian()
            alert('添加成功')
            }
        },
        error: (e) => {
            console.log(e);
        }
    })
}
//详情
$(".xiang").hide()
function xiang(id) {
    $.ajax({
        type: 'get',
        url: 'http://47.94.4.201/index.php/index/index/getteacherbyid',
        data: {
            id: id
        },
        dataType: 'json',
        success: (a) => {
            var b=a.data
            if (b.sex == 1) {
                b.sex = '女'
            }
            else if (b.sex == 0) {
                b.sex = '男'
            }
            console.log(b);
            $('.boy9').html("")
            $('.boy9').append(`
                <tbody>
            <tr>
              <td>姓名：</td>
              <td>${b.name}</td>
              <td>职位：</td>
              <td>讲师</td>
              <td rowspan ="3"  class="tdimg"><img src="https://ts1.cn.mm.bing.net/th?id=OIP-C.jf5fAnMXNNCBn9bZmcmonQHaHa&w=250&h=250&c=8&rs=1&qlt=90&o=6&dpr=1.3&pid=3.1&rm=2" alt="" class="img1"></td>
            </tr>
            <tr>
              <td>昵称：</td>
              <td>${b.nick}</td>
              <td>出生日期：</td>
              <td>${b.birthdata}</td>
       
            </tr>
            <tr>
              <td>性别：</td>
              <td>${b.sex}</td>
              <td>手机号码：</td>
              <td>${b.iphone}</td>
          
            </tr>
          </tbody>`)
            $(".xiang").show()
        },
        error: (e) => {
            console.log(e);
        }
    })
}
//返回首页
$('.but11').click(()=>{
    $(".xiang").hide()
})
//修改
$('.xiugai').hide()
var xiu_id
function xiu(id) {
    xiu_id = id
    $(".sss").hide()
    $('.xiugai').show()
    // console.log($('.jiang'));

}
$(".bian").on('click', () => {
    var inps = $('.xiugai input')
    $.ajax({
        type: 'post',
        url: 'http://47.94.4.201/index.php/index/index/upteacher',
        data: {
            id: xiu_id,
            name: inps.eq(0).val(),
            birthdata: inps.eq(1).val(),
            sex: inps.eq(0).val()

        },
        dataType: 'json',
        success: (a) => {
            console.log(a);
            $('.xiugai').hide()
            $(".sss").show()
            xuan()
        },
        error: (e) => {
            console.log(e);

        }
    })
})
// 基于准备好的dom，初始化echarts实例
var myChart = echarts.init(document.getElementById('main'));
var myChart1 = echarts.init(document.getElementById('main1'));
//仪表盘
$.ajax({
    type:'get',
    url:'http://47.94.4.201/index.php/index/teacher/teacherlist',
    data:{},
    dataType:'json',
    success:(a)=>{
    var b=a.data.data
    var c=[]
    var d=[]
    var e=[]
    b.forEach(item=>{
        // console.log(item);
        c.push(item.name)
        d.push(item.id)
        e.push(item.iphone)
        // console.log(c[0]);
        // 指定图表的配置项和数据
        var option = {
            title: {
                text: '教师名字以及编号前五个'
            },
            tooltip: {},
            legend: {
                data: ['编号']
            },
            xAxis: {
                data: [`${c[0]}`,`${c[1]}`,`${c[2]}`,`${c[3]}`,`${c[4]}`]
            },
            yAxis: {},
            series: [
                {
                    name: '编号',
                    type: 'bar',
                    data: [`${d[0]}`,`${d[1]}`,`${d[2]}`,`${d[3]}`,`${d[4]}`]
                }
            ]
        };
        option1 = {
            title: {
                text: '教师名字以及电话前五个'
            },
            tooltip: {
              trigger: 'item'
            },
            legend: {
              top: '5%',
              left: 'center'
            },
            series: [
              {
                name: '昵称',
                type: 'pie',
                radius: ['40%', '70%'],
                avoidLabelOverlap: false,
                itemStyle: {
                  borderRadius: 10,
                  borderColor: '#fff',
                  borderWidth: 2
                },
                label: {
                  show: false,
                  position: 'center'
                },
                emphasis: {
                  label: {
                    show: true,
                    fontSize: 40,
                    fontWeight: 'bold'
                  }
                },
                labelLine: {
                  show: false
                },
                data: [
                  { value:`${e[0]}`, name: `${c[0]}` },
                  { value: `${e[1]}`, name: `${c[1]}`},
                  { value:`${e[2]}`, name: `${c[2]}` },
                  { value: `${e[3]}`, name: `${c[3]}` },
                  { value: `${e[4]}`, name: `${c[4]}` }
                ]
              }
            ]
          };
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);
        myChart1.setOption(option1);

        
    })
    },
    error:(e)=>{
        console.log(e);
        
    }
})

